<template>
  <div class="py-3" v-loading="saveloading">
    <div class="report-action">
      <el-button type="primary" @click="$router.back()">
        <i class="fa fa-angle-left"></i>
        返回
      </el-button>
      <el-button type="primary" @click="printPage">
        <i class="fa fa-print"></i>
        打印
      </el-button>
    </div>
    <div class="report-wrap">
      <div class="report-main" id="report-print">
        <div class="report-section">
          <h2 class="report-title">担保项目保后监管报告</h2>
          <div class="text-left font-weight-bold" style="float: left">
            档案编号：
            <span v-if="censusData.census_number">{{ levelData.loan_notice }}</span>
            <span v-else class="d-print-none">
              <el-tooltip
                class="item"
                content="调查报告完成后，项目编号自动生成"
                effect="dark"
                placement="bottom"
              >
                <el-button class="text-muted" type="text">
                  待定
                  <i class="fa fa-question-circle"></i>
                </el-button>
              </el-tooltip>
            </span>
          </div>
          <div class="text-right font-weight-bold" style="float: right">
            检查表序号：
            <span v-if="rowid">{{ controlData.order_num }}</span>
            <span v-else class="d-print-none">
              <el-tooltip
                class="item"
                content="监管报告完成后，项目编号自动生成"
                effect="dark"
                placement="bottom"
              >
                <el-button class="text-muted" type="text">
                  待定
                  <i class="fa fa-question-circle"></i>
                </el-button>
              </el-tooltip>
            </span>
          </div>
          <table class="table table-bordered">
            <colgroup>
              <col width="10%" />
              <col width="8%" />
              <col width="8%" />
              <col width="8%" />
              <col width="8%" />
              <col width="10%" />
              <col width="12%" />
              <col width="6%" />
              <col width="6%" />
            </colgroup>
            <tr>
              <td>客户名称</td>
              <td colspan="4">{{ relatedData.customer_name }}</td>
              <td>经营范围</td>
              <td colspan="3">{{ relatedData.business_scope }}</td>
            </tr>
            <tr>
              <td>法人代表</td>
              <td colspan="4">{{ shareData.real_name }}</td>
              <td>联系电话</td>
              <td colspan="3">{{ shareData.mobile_no }}</td>
            </tr>
            <tr>
              <td>借款人地址</td>
              <td colspan="4">{{ shareData.address }}</td>
              <td>公司住所</td>
              <td colspan="3">{{ relatedData.address }}</td>
            </tr>
            <tr>
              <td>贷款银行</td>
              <td colspan="4">{{ levelData.bank_name }}</td>
              <td>贷款金额</td>
              <td colspan="2">{{ levelData.reply_funds }}</td>
              <td>万元</td>
            </tr>
            <tr>
              <td>还款方式</td>
              <td colspan="4">{{ levelData.repay_method }}</td>
              <td>在保责余额</td>
              <td colspan="2" class="report-input-td">
                <span v-if="postStatus">{{ form.load_left }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.load_left"
                ></textarea>
              </td>
              <td>万元</td>
            </tr>
            <tr>
              <td>贷款期限</td>
              <td>始</td>
              <td>{{ $utils.dateFormat(levelData.load_date, 'yyyy.MM.dd') }}</td>
              <td>终</td>
              <td>{{ $utils.dateFormat(levelData.load_end_date, 'yyyy.MM.dd') }}</td>
              <td>资金用途</td>
              <td colspan="3">{{ relatedData.funds_use_dir }}</td>
            </tr>
            <tr>
              <td>反担保措施</td>
              <td
                colspan="8"
                class="text-left"
                v-html="formatLine(censusData.counter_guarantee)"
              ></td>
            </tr>
            <tr>
              <td>项目经理</td>
              <td>A</td>
              <td>{{ relatedData.res_a_name }}</td>
              <td>B</td>
              <td>{{ relatedData.res_b_name }}</td>
              <td>风控专员</td>
              <td colspan="3">{{ censusData.risk_control_person }}</td>
            </tr>
            <tr>
              <td>查访方式</td>
              <td colspan="8">
                <el-checkbox-group v-model="arr" :min="1" @change="checkBox">
                  <el-checkbox key="1" label="1" style="width: 40%">实地查访</el-checkbox>
                  <el-checkbox key="2" label="0" style="width: 40%">非实地查访</el-checkbox>
                </el-checkbox-group>
              </td>
            </tr>
            <tr>
              <td>参与的查访人员</td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.visit_persons }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.visit_persons"
                ></textarea>
              </td>
              <td>查访时间</td>
              <td colspan="3" class="report-input-td">
                <span v-if="postStatus">
                  {{ $utils.dateFormat(form.visit_date, 'yyyy.MM.dd') }}
                </span>
                <el-date-picker
                  v-else
                  v-model="form.visit_date"
                  type="date"
                  placeholder="选择日期"
                  format="yyyy-MM-dd"
                  value-format="yyyy-MM-dd"
                ></el-date-picker>
              </td>
            </tr>
            <tr>
              <td>客户单位人员</td>
              <td colspan="8" class="report-input-td">
                <span v-if="postStatus">{{ form.customer_persons }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.customer_persons"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td>资料收集</td>
              <td colspan="8">
                <el-checkbox-group v-model="collection" @change="setCollection">
                  <el-checkbox key="1" label="1" style="width: 20%">用电信息</el-checkbox>
                  <el-checkbox key="2" label="2" style="width: 20%">现场照片</el-checkbox>
                  <el-checkbox key="3" label="3" style="width: 20%">其他资料</el-checkbox>
                </el-checkbox-group>
              </td>
            </tr>
            <tr>
              <td colspan="9">贷后管理记录</td>
            </tr>

            <tr>
              <td colspan="3">时间</td>
              <td colspan="3">用户名</td>
              <td colspan="3">记录</td>
            </tr>
            <tr v-for="(p, index) of tableData" :key="index">
              <td colspan="3">{{ $utils.dateFormat(p.visit_date, 'yyyy.MM.dd') }}</td>
              <td colspan="3">{{ p.visit_person }}</td>
              <td colspan="3">
                <span v-if="p.visit_status === p.visit_des">
                  {{ enumVisUseType[p.visit_status] }}
                </span>
                <span v-else>{{ p.visit_des }}</span>
              </td>
            </tr>
            <tr v-if="tableData.length < 1">
              <td colspan="9">暂无数据</td>
            </tr>

            <tr>
              <td colspan="9">勘察记录（实地查访适用）</td>
            </tr>
            <tr>
              <td colspan="9" class="text-left">1.担保贷款的用途、还款及纳税检查</td>
            </tr>
            <tr>
              <td colspan="9" class="report-input-td text-left">
                <span
                  v-if="postStatus"
                  style="margin-left: 2rem"
                  v-html="formatLine(Record)"
                ></span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="3"
                  v-model="Record"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="9" class="text-left">2.检查细项</td>
            </tr>
            <tr>
              <td colspan="3">预警信号或关注事项</td>
              <td>是</td>
              <td>否</td>
              <td colspan="4">原因</td>
            </tr>
            <tr>
              <td colspan="3">应收帐款有无大幅增加，收回拖延</td>
              <td @click="setItem('is_account_recived_inc', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_account_recived_inc === '1'"></i>
              </td>
              <td @click="setItem('is_account_recived_inc', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_account_recived_inc === '0'"></i>
              </td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.reason_account_recived_inc }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.reason_account_recived_inc"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="3">存货是否大幅变动</td>
              <td @click="setItem('is_stock_inc', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_stock_inc === '1'"></i>
              </td>
              <td @click="setItem('is_stock_inc', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_stock_inc === '0'"></i>
              </td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.reason_stock_inc }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.reason_stock_inc"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="3">银行债务有无大量增加</td>
              <td @click="setItem('is_bank_debit_inc', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_bank_debit_inc === '1'"></i>
              </td>
              <td @click="setItem('is_bank_debit_inc', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_bank_debit_inc === '0'"></i>
              </td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.reason_bank_debit_inc }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.reason_bank_debit_inc"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="3">资产负债结构有无重大变化</td>
              <td @click="setItem('is_asset_debit_inc', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_asset_debit_inc === '1'"></i>
              </td>
              <td @click="setItem('is_asset_debit_inc', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_asset_debit_inc === '0'"></i>
              </td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.reason_asset_debit_inc }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.reason_asset_debit_inc"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="3">成本上升或利润下降</td>
              <td @click="setItem('is_cost_inc', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_cost_inc === '1'"></i>
              </td>
              <td @click="setItem('is_cost_inc', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_cost_inc === '0'"></i>
              </td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.reason_cost_inc }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.reason_cost_inc"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="3">用电是否大幅变化（用电查询分析）</td>
              <td @click="setItem('is_use_ele_inc', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_use_ele_inc === '1'"></i>
              </td>
              <td @click="setItem('is_use_ele_inc', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_use_ele_inc === '0'"></i>
              </td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.reason_use_ele_inc }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.reason_use_ele_inc"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="3">货物有无异常进出（视频监控）</td>
              <td @click="setItem('is_goods_inc', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_goods_inc === '1'"></i>
              </td>
              <td @click="setItem('is_goods_inc', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_goods_inc === '0'"></i>
              </td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.reason_goods_inc }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.reason_goods_inc"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="3">人工支出是否正常</td>
              <td @click="setItem('is_person_cost_inc', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_person_cost_inc === '1'"></i>
              </td>
              <td @click="setItem('is_person_cost_inc', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_person_cost_inc === '0'"></i>
              </td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.reason_person_cost_inc }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.reason_person_cost_inc"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="5">其他</td>
              <td colspan="4" class="report-input-td">
                <span v-if="postStatus">{{ form.reason_other_inc }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.reason_other_inc"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td>分析及结论</td>
              <td colspan="8" class="report-input-td text-left">
                <span v-if="postStatus" style="margin-left: 2rem">{{ form.inc_result }}</span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="1"
                  v-model="form.inc_result"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="9" class="text-left">3.投资项目完成情况检查</td>
            </tr>
            <tr>
              <td colspan="9" class="report-input-td text-left">
                <span
                  v-if="postStatus"
                  style="margin-left: 2rem"
                  v-html="formatLine(form.invest_check_result)"
                ></span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="3"
                  v-model="form.invest_check_result"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="9" class="text-left">4.重大经营管理事项检查</td>
            </tr>
            <tr>
              <td colspan="9" class="report-input-td text-left">
                <span
                  v-if="postStatus"
                  style="margin-left: 2rem"
                  v-html="formatLine(form.main_business_check_result)"
                ></span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="3"
                  v-model="form.main_business_check_result"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="9" class="text-left">5.反担保措施检查</td>
            </tr>
            <tr>
              <td colspan="7">关注事项</td>
              <td>是</td>
              <td>否</td>
            </tr>
            <tr>
              <td colspan="7" class="text-left">
                抵押物是否出租、转租、赠予，形态是否完整，价值、权属有无变动等
              </td>
              <td @click="setItem('is_pawn_sublet', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_pawn_sublet === '1'"></i>
              </td>
              <td @click="setItem('is_pawn_sublet', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_pawn_sublet === '0'"></i>
              </td>
            </tr>
            <tr>
              <td colspan="7" class="text-left">
                反担保企业资产、信用、财务等状况有无恶化，反保能力有无下降
              </td>
              <td @click="setItem('is_warrant_des', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_warrant_des === '1'"></i>
              </td>
              <td @click="setItem('is_warrant_des', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_warrant_des === '0'"></i>
              </td>
            </tr>
            <tr>
              <td colspan="7" class="text-left">反担保个人有无经济、诉讼案件，大额财产有无变化</td>
              <td @click="setItem('is_warrant_eco_des', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_warrant_eco_des === '1'"></i>
              </td>
              <td @click="setItem('is_warrant_eco_des', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_warrant_eco_des === '0'"></i>
              </td>
            </tr>
            <tr>
              <td colspan="7" class="text-left">反担保股权权属和比重是否发生变动</td>
              <td @click="setItem('is_warrant_own_change', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_warrant_own_change === '1'"></i>
              </td>
              <td @click="setItem('is_warrant_own_change', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_warrant_own_change === '0'"></i>
              </td>
            </tr>
            <tr>
              <td colspan="7" class="text-left">保证金有无挪用、是否足额</td>
              <td @click="setItem('is_bond_emb', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_bond_emb === '1'"></i>
              </td>
              <td @click="setItem('is_bond_emb', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_bond_emb === '0'"></i>
              </td>
            </tr>
            <tr>
              <td colspan="7" class="text-left">其他</td>
              <td @click="setItem('is_other_inc', '1')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_other_inc === '1'"></i>
              </td>
              <td @click="setItem('is_other_inc', '0')" class="report-input-td">
                <i class="fa fa-check" v-show="form.is_other_inc === '0'"></i>
              </td>
            </tr>
            <tr>
              <td colspan="9" class="text-left">分析及结论：</td>
            </tr>
            <tr>
              <td colspan="9" class="report-input-td text-left">
                <span
                  v-if="postStatus"
                  style="margin-left: 2rem"
                  v-html="formatLine(form.warrant_result)"
                ></span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="3"
                  v-model="form.warrant_result"
                ></textarea>
              </td>
            </tr>
            <tr>
              <td colspan="2">原风险评级</td>
              <td colspan="2" class="report-input-td">
                <span v-if="postStatus">{{ enumRenewalStatus[form.load_beh_status] }}</span>
                <el-select v-model="form.load_beh_status" style="width: 100%" v-else>
                  <el-option
                    :key="key"
                    :label="value"
                    :value="key"
                    v-for="(value, key) in enumRenewalStatus"
                  ></el-option>
                </el-select>
              </td>
              <td colspan="2">拟调整风险评级</td>
              <td colspan="3" class="report-input-td">
                <span v-if="postStatus">{{ enumRenewalStatus[form.adjust_beh_status] }}</span>
                <el-select v-model="form.adjust_beh_status" style="width: 100%" v-else>
                  <el-option
                    :key="key"
                    :label="value"
                    :value="key"
                    v-for="(value, key) in enumRenewalStatus"
                  ></el-option>
                </el-select>
              </td>
            </tr>
            <tr>
              <td colspan="2">查访人员签名</td>
              <td colspan="7"></td>
            </tr>
            <tr>
              <td colspan="9" class="text-left">风险管理部经理意见：</td>
            </tr>
            <tr>
              <td colspan="9" class="report-input-td text-left">
                <span
                  v-if="postStatus"
                  style="margin-left: 2rem"
                  v-html="formatLine(form.risk_manager_option)"
                ></span>
                <textarea
                  type="text"
                  class="form-control d-print-none"
                  v-else
                  rows="3"
                  v-model="form.risk_manager_option"
                ></textarea>
              </td>
            </tr>
          </table>

          <div style="page-break-after: always">
            <h3 class="report-section-title">附件</h3>

            <div class="d-print-none">
              <upload-oss
                multiple
                accept="image/*"
                listType="picture-card"
                :limit="4"
                :file-list="attachFileListOne"
                :on-complete="handleImagesCompleteOne"
                :on-exceed="handleOnExceed"
                :on-remove="handleRemove"
                ref="attachOssOne"
              ></upload-oss>
            </div>

            <div class="d-none d-print-block">
              <div v-for="(img, index) in attachFileListOne" :key="index" class="mb-1 text-center">
                <img :src="img.url" alt="附件图片" height="400" style="max-width: 100%" />
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="report-action">
      <el-button type="primary" @click="$router.back()">
        <i class="fa fa-angle-left"></i>
        返回
      </el-button>
      <el-button type="primary" @click="printPage">
        <i class="fa fa-print"></i>
        打印
      </el-button>
      <el-button type="primary" @click="handleSubmit" v-show="!hasFinish">
        <i class="fa fa-save"></i>
        保存
      </el-button>
      <el-button type="primary" @click="onFinishCencus" v-show="!hasFinish">
        <i class="fa fa-save"></i>
        完成报告
      </el-button>
    </div>
  </div>
</template>
<script>
import { enumVisUseType, enumRenewalStatus } from '@/credit/plugins/enum'
import { formatLine } from '@/common/plugins/tools/format'
import { printHtml, arrayFromString } from '@vimi/utils-tool'

export default {
  components: {},
  props: {},
  data() {
    return {
      enumVisUseType,
      enumRenewalStatus,
      id: '',
      reportStatus: '',
      // 项目基本信息
      relatedData: {},
      // 调查报告
      censusData: {},
      // 当前 监管报告
      controlData: {},
      form: {},
      // 贷款起止时间
      levelData: {},
      // 法人信息
      shareData: {},
      arr: [],
      collection: [],
      tableData: [],
      saveloading: false,
      // 勘查记录
      Record: '',
      postStatus: false,
      // 附件
      attachFileListOne: [],
    }
  },
  computed: {
    hasFinish() {
      return this.reportStatus === '2'
    },
  },
  watch: {},
  created() {
    this.id = this.$route.query.id || sessionStorage.getItem('customer_related_id')
    this.rowid = this.$route.query.rowid
    this.reportStatus = sessionStorage.getItem('report_status')
    this.getData()
  },
  mounted() {},
  methods: {
    formatLine,
    onFinishCencus() {
      this.deleteMsgBox({
        message: '确定完成（完成后不能再修改）？',
        beforeClose: async () => {
          await this.$api.updateData('credit', 'credit_load_beh_report', this.rowid, {
            report_status: 2,
          })
        },
        afterClose: this.getData,
      })
    },
    deleteMsgBox({
      title = '提示',
      message = '确定完成？',
      beforeClose = () => {},
      afterClose = () => {},
      actionMessage = '完成中...',
      successMessage = '完成成功！',
      errorMessage = '完成失败，请重试！',
    }) {
      const self = this
      this.$msgbox({
        title: title,
        message: this.$createElement('span', undefined, message),
        showCancelButton: true,
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        beforeClose: async (action, instance, done) => {
          function afterSuccess() {
            afterClose()
            self.$store.dispatch('getTaskCount')
            self.$message.success(successMessage)
            instance.confirmButtonLoading = false
            instance.confirmButtonText = '确定'
            done()
          }

          if (action === 'confirm') {
            instance.confirmButtonLoading = true
            instance.confirmButtonText = actionMessage

            const before = beforeClose()
            if (before.then) {
              before
                .then(() => {
                  afterSuccess()
                })
                .catch(() => {
                  self.$message.error(errorMessage)
                })
            } else {
              afterSuccess()
            }
          } else {
            done()
          }
        },
      }).catch(() => {})
    },

    async submit() {
      this.form.customer_related_id = this.id
      this.form.visit_spot_record = this.Record

      if (!this.rowid) {
        this.behAdd()
      } else {
        this.behUpdate()
      }
    },
    async behAdd() {
      this.saveloading = true
      const [res, err] = await this.$utils.promise(
        this.$api.addData('credit', 'credit_load_beh_report', this.form)
      )
      this.saveloading = false
      this.behAfter(res, err)
    },
    async behUpdate() {
      this.saveloading = true
      const [res, err] = await this.$utils.promise(
        this.$api.updateData('credit', 'credit_load_beh_report', this.rowid, this.form)
      )
      this.saveloading = false
      this.behAfter(res, err)
    },
    behAfter(res, err) {
      if (!res) {
        this.$message.error(`保存失败，请重试！（${err.status}）`)
      } else {
        this.$router.back()
        this.$message.success('保存成功！')
      }
    },
    checkBox() {
      if (this.arr.length > 1) {
        this.arr.splice(0, 1)
      }
      this.form.is_spot_visit = this.arr[0]
    },
    setCollection(val) {
      this.form.is_ele_data = 0
      this.form.is_scen_picture = 0
      this.form.is_other_data = 0
      for (let p of val) {
        if (p === '1') {
          this.form.is_ele_data = '1'
        }
        if (p === '2') {
          this.form.is_scen_picture = '1'
        }
        if (p === '3') {
          this.form.is_other_data = '1'
        }
      }
    },
    setItem(key, val) {
      this.$set(this.form, key, val)
    },
    getData() {
      this.getRelatedData()
      this.getCensusData()
      this.getLevelData()
      this.getShareData()
      this.getControlData()
      if (!this.rowid) {
        this.gettableflData()
      }
    },
    getCensusData() {
      this.$api
        .getData('credit', 'credit_census_report', {
          'customer_related_id.eq': this.id,
        })
        .then(res => {
          if (!res.data || !res.data.length) {
            return
          }
          this.censusData = res.data[0]
        })
    },
    getRelatedData() {
      this.$api
        .getData(
          'credit',
          'customer_related_view',
          {
            'customer_related_id.eq': this.id,
          },
          {
            create_time: 'desc',
          }
        )
        .then(res => {
          if (!res.data || !res.data.length) {
            return
          }
          this.relatedData = res.data[0]
        })
    },
    getLevelData() {
      this.$api
        .getData(
          'credit',
          'credit_level_review',
          {
            'customer_related_id.eq': this.id,
          },
          {
            create_time: 'desc',
          }
        )
        .then(res => {
          if (!res.data || !res.data.length) {
            return
          }
          this.levelData = res.data[0]
        })
    },
    getShareData() {
      this.$api
        .getData(
          'credit',
          'datum_customer_shareholder_view',
          {
            'customer_related_id.eq': this.id,
            'is_corp.eq': '1',
          },
          {
            create_time: 'desc',
          }
        )
        .then(res => {
          if (!res.data || !res.data.length) {
            return
          }
          this.shareData = res.data[0]
        })
    },
    gettableflData() {
      let params = { 'customer_related_id.eq': this.id }
      if (this.rowid && this.form.last_visit_date) {
        params['visit_date.gt'] = this.form.last_visit_date
        if (this.form.visit_date) {
          params['visit_date.lte'] = this.form.visit_date
        }
      }
      this.$api
        .getData('credit', 'credit_visit_record', params, {
          create_time: 'desc',
        })
        .then(res => {
          if (!res.data || !res.data.length) {
            return
          }
          this.tableData = res.data
          if (this.rowid !== '') {
            return
          }
          for (let p of this.tableData) {
            if (p.visit_status === p.visit_des) {
              this.Record += enumVisUseType[p.visit_status] + ';'
            } else {
              this.Record += p.visit_des + ';'
            }
          }
        })
    },
    getControlData() {
      if (this.rowid === '') {
        return
      }
      this.$api
        .getData(
          'credit',
          'credit_load_beh_report',
          {
            'credit_load_beh_report_id.eq': this.rowid,
          },
          {
            create_time: 'desc',
          }
        )
        .then(res => {
          if (!res.data || !res.data.length) {
            return
          }
          this.arr = []
          this.collection = []
          this.controlData = res.data[0]
          this.form = { ...this.controlData }

          this.attachFileListOne = arrayFromString(this.form.attachment).map(item => {
            return { name: '', url: item }
          })

          this.gettableflData()
          this.Record = this.form.visit_spot_record
          this.arr.push(this.form.is_spot_visit)
          if (this.form.is_ele_data === '1') {
            this.collection.push('1')
          }
          if (this.form.is_scen_picture === '1') {
            this.collection.push('2')
          }
          if (this.form.is_other_data === '1') {
            this.collection.push('3')
          }
        })
    },

    handleSubmit() {
      const ref = this.$refs.attachOssOne
      if (ref) {
        ref.submit()
      }
    },

    handleImagesCompleteOne(images) {
      this.form.attachment = this.getImageString(images)
      this.submit()
    },

    handleOnExceed() {
      this.$message.error('附件图片最多四张！')
    },

    handleRemove(file, fileList) {
      this.form.attachment = this.getImageString(fileList)
      this.submit()
    },

    getImageString(images = []) {
      return images && images.length ? `["${images.map(item => item.url).join('","')}"]` : ''
    },

    printPage() {
      printHtml(
        document.getElementById('report-print').innerHTML,
        `
          .report-title {text-align: center;margin-bottom: 1rem;font-weight: bold;font-size: 1.5rem;line-height: 1.5;}
          .report-section {margin-bottom: 1rem;}
          .report-section .table-bordered td {border-color: #333;padding: 0.25rem;text-align: center;vertical-align: middle;}
          .report-section-title {font-size: 1rem;font-weight: bold;}
        `
      )
    },
  },
}
</script>
<style lang="scss" scoped>
$report-width: 100%;
$report-input-border-color: #333;

.report-action {
  width: $report-width;
  margin: 1rem auto;
}

.report-wrap {
  width: $report-width;
  margin: 0 auto;
  padding: 2rem;
  border: 1px solid #e9ecef;
  border-radius: 2px;
  background-color: #fff;
  font-family: SimSun;

  .report-title {
    text-align: center;
    margin-bottom: 1rem;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.5;
  }

  .report-section {
    margin-bottom: 1rem;

    .table-bordered td {
      border-color: #333;
      padding: 0.25rem;
      text-align: center;
      vertical-align: middle;

      &.report-input-last-td {
        border-right-color: $report-input-border-color;
      }

      &.report-input-td {
        border-color: $report-input-border-color;
        background-color: #ffffee;
        padding: 0;

        .form-control {
          border: none;
          background-color: #ffffee;
          padding: 0.25rem;
        }
      }
    }
  }

  .report-complete .report-input-td {
    background-color: #ffffff !important;
  }

  .report-section-title {
    font-size: 1rem;
    font-weight: bold;
  }
}
</style>
